﻿<div id="pui_util_grid">
</div>
<script>
(function(){
	var dr=new Mui.util.DocsRender({
		renderTo:'pui_util_grid',
		data:{
			title:'Mui.util.Grid',
			superclass:'Mui.util.Panel',
			subclass:'Mui.util.JsonGrid',
			desc:'该组件继承自Viewer，提供弹出的窗体，并在窗体的背后添加半透明的遮罩层，屏蔽后续的内容',
			private:[{
				name:'__eventBus',
				desc:'对象的事件容器',
				type:'object',
				def:'{}'
			},{
				name:'__type',
				desc:'类型，用于对类进行描述',
				type:'string',
				def:'Grid'
			},{
				name:'__constructor',
				desc:'构造函数',
				type:'string',
				def:'Mui.util.Grid'
			}],
			public:[{
				name:'columns',
				desc:'列头配置，如：[{header:\'年龄\',field:\'age\',width:100,renderer:function(val){return val+\'岁\'}}]',
				type:'array',
				def:'[]'
			},{
				name:'hasNumber',
				desc:'是否有数字列',
				type:'boolean',
				def:'true'
			},{
				name:'hasCheckbox',
				desc:'是否有选中框列',
				type:'boolean',
				def:'true'
			},{
				name:'hasPagebar',
				desc:'是否有分页工具栏',
				type:'boolean',
				def:'true'
			},{
				name:'pageSize',
				desc:'每页显示的记录条数',
				type:'number',
				def:'20'
			},{
				name:'pageIndex',
				desc:'当前显示的页数，从0开始',
				type:'boolean',
				def:'true'
			},{
				name:'height',
				desc:'高度',
				type:'number',
				def:'-1'
			},{
				name:'width',
				desc:'宽度',
				type:'number',
				def:'-1'
			},{
				name:'data',
				desc:'需要展示的数据',
				type:'number',
				def:'-1'
			},{
				name:'rows',
				desc:'需要展示的数据',
				type:'array',
				def:'[{name:\'john\',age:20,sex:\'女\'}]'
			}],
			fn:[
			{
				name:'getRowData(string key)',
				desc:'根据key值，获取行记录，没有则返回undefined',
				param:[{
					name:'key',
					desc:'行记录的唯一标识key'
				}],
				ret:'row record',
				retType:'object'
			},
			{
				name:'getRowDataByIndex(number index)',
				desc:'根据index获取行记录，没有这返回undefined',
				param:[{
					name:'index',
					desc:'行记录的序号'
				}],
				ret:'row record',
				retType:'object'
			},
			{
				name:'getCheckboxEl(string key)',
				desc:'根据key值，获取checkbox确认框的jQuery Dom',
				param:[{
					name:'key',
					desc:'行记录的唯一标识key'
				}],
				ret:'当前记录的确认框的jQuery Dom',
				retType:'jQuery Object'
			},
			{
				name:'getRowsEl()',
				desc:'获取用于包含行记录的jQuery Dom元素',
				ret:'$(\'#\'+this.id+\'_rows\')',
				retType:'jQuery Object'
			},
			{
				name:'getRowEls()',
				desc:'获取所有的行记录的jQuery Dom元素',
				ret:'$(\'#\'+this.id+\'_rows .\'+this.cls.row);',
				retType:'jQuery Object'
			}, 
			{
				name:'getSelectedRowEls()',
				desc:'获取选择的行记录的jQuery Dom元素',
				ret:'this.getRowsEl().find(\'.\'+this.cls.rowSelected)',
				retType:'jQuery Object'
			},
			{
				name:'getCheckboxEls()',
				desc:'获取所有checkbox确认框的jQuery Dom元素',
				ret:'this.getRowEls().find(\'.\'+this.cls.checkboxEl)',
				//ret:'this.getRowsEl().find(\'.\'+this.cls.rowSelected)',
				retType:'jQuery Object'
			},
			{
				name:'getCheckedboxEls()',
				desc:'获取选中的checkbox确认框的jQuery Dom元素',
				ret:'this.getRowEls().find(\'.\'+this.cls.checkboxEl+\':checked\')',
				retType:'jQuery Object'
			},
			{
				name:'getRowEl(string key)',
				desc:'根据key值，获取行的jQuery Dom元素',
				ret:'$(\'#\'+key+\'_row\')',
				param:[{
					name:'key',
					desc:'行记录的唯一标识key'
				}],
				retType:'jQuery Object'
			},
			{
				name:'getRowElByIndex(number index)',
				desc:'根据序号，获取行的jQuery Dom元素',
				param:[{
					name:'index',
					desc:'行记录的序号'
				}],
				ret:'行的jQuery Dom元素',
				retType:'jQuery Object'
			},
			{
				name:'getKeyByIndex(number index)',
				desc:'根据序号，获取行记录的key',
				param:[{
					name:'index',
					desc:'行记录的序号'
				}],
				ret:'行记录的key',
				retType:'number'
			},
			{
				name:'getIndexByKey(string key)',
				desc:'根据key值，获取行记录的index序号',
				ret:'行记录的序号',
				param:[{
					name:'key',
					desc:'行记录的唯一标识key'
				}],
				retType:'number'
			},
			{
				name:'getColumnByField(string field)',
				desc:'根据列标识field，获取column',
				param:[{
					name:'field',
					desc:'列头的记录标识'
				}],
				ret:'{field:\'age\',header:\'年龄\',width:100}',
				retType:'object'
			},
			{
				name:'getColumnsEl()',
				desc:'获取包含column列头的jQuery Dom',
				ret:'$(\'#\'+this.id+\'_columns\')',
				retType:'jQuery Object'
			},
			{
				name:'render()',
				desc:'重写父类的render方法，除执行父类的render方法外，主要包括列头的渲染、行记录的渲染、分页工具栏的渲染'
			},
			{
				name:'renderColumns()',
				desc:'渲染列头'
			},
			{
				name:'renderRows()',
				desc:'渲染行记录'
			},
			{
				name:'renderPagebar(number total,funciton pagging)',
				param:[{
					name:'total',
					desc:'总记录数'
				},{
					name:'pagging',
					desc:'分页工具条的分页事件的响应方法'
				}],
				desc:'渲染分页工具条'
			},
			{
				name:'addRow(object row)',
				param:[{
					name:'row',
					desc:'行记录'
				}],
				desc:'添加一条行记录'
			},
			{
				name:'delRow(string key)',
				param:[{
					name:'key',
					desc:'行记录的唯一标识key'
				}],
				desc:'根据key值，删除一条行记录'
			},
			{
				name:'delRowByIndex(number index)',
				
				param:[{
					name:'index',
					desc:'行记录的序号'
				}],
				desc:'根据行记录的序号，删除一条行记录'
			},
			{
				name:'setHeight(number height)',
				
				param:[{
					name:'height',
					desc:'高度值'
				}],
				desc:'设置grid的高度'
			},
			{
				name:'setWidth(number width)',
				
				param:[{
					name:'width',
					desc:'宽度值'
				}],
				desc:'设置grid的宽度值'
			},
			{
				name:'initComponent()',
				desc:'重写父类的initComponent方法'
			}
			]
		}
	});
})();
</script>